require.config({
    baseUrl: "./modules",
    paths: {
        jq: "../libs/jquery",
        abc: "getGoods",
        renderI: "renderIndex",
        setLocal: "setLocal",
        sp: "subPanel"
    }
})

require(["jq", "abc", "renderI", "setLocal", "sp"], (_, gg, renderI, setLocal, sp) => {
    // 1. 请求数据
    gg().then((res) => {
        // 2. 渲染页面
        // 解析地址栏
        const key = location.search.split("=")[1] || "";
        if (key !== "") {
            res = res.filter(val => {
                return val.proName.includes(decodeURIComponent(key));
            })
        }
        renderI($(".cont"), res);
        window.res = res;
    });

    // 3. 事件委托绑定事件
    $('.cont').on("click", ".add", function () {
        const id = $(this).parent().attr("index");
        // 根据DOM结构获取价格
        const price = $(this).prev().prev().find("span").eq(1).html() - 0;
        // 4. 将点击的商品数据信息存储到本地存储：id，数量，选中状态，价格
        setLocal(id, price);
        alert("已加入购物车")
    })

    // 渲染二级面板和三级面板的数据
    sp();
    // 绑定二级面板显示消失事件
    $(".bar").find("div").on("mouseover", function () {
        $(".nav-wrap").css("display", "flex").parent().on("mouseout", function () {
            $(".nav-wrap").css("display", "none")
        })
    })

    $("#search-btn1").click(function () {
        // 因为搜索时，页面必然已经存在，数据必然已经产生，所有可以直接通过全局变量获取到商品数据
        // console.log(res);

        // 借助数组的filter方法实现过滤筛选功能
        // console.log(window.res);
        gg().then((res) => {
            window.res = res.filter(val => {
                return val.proName.includes($("#searchKey").val());
            })

            // 根据筛选之后的数据，重新渲染页面
            renderI($(".cont"), window.res);
        })
    })
    // 排序
    let flag = 0;
    $('#sortBtn').on("click", function () {
        // 按价格排序
        if (flag === 0) {
            // 从小至大
            window.res.sort((obj1, obj2) => {
                return obj1.price - obj2.price;
            });
            renderI($(".cont"), window.res);
            flag = 1;
        } else if (flag === 1) {
            // 从大至小
            window.res.sort((obj1, obj2) => {
                return obj2.price - obj1.price;
            });
            renderI($(".cont"), window.res);
            flag = 0;

        }
    });
})

// function sort(res, renderI) {
//     let flag = 0;

// }
